<template>
    <rui-page :defines="defines">
        <Row>
            <rui-query :label-width="120"
                       :query="queryParamData"
                       :query-rows="queryRows"
                       ref="paramQuery"
            />
        </Row>
        <rui-table :defineId="'sysParamDefine'"
                   :fixedLeft="['paramKey','paramDesc']"
                   :fixedRight="['action']"
                   :showIndex="false"
                   :slots="[{key:'action',slot:'action'}]"
                   @loadDatas="queryParamData"
                   ref="paramTable"
                   ref-query="paramQuery">
            <template slot="toolBar">
                <Button @click="syncParams" icon="md-sync" type="primary" >同步参参数</Button>
                <Button @click="createSysParam" icon="ios-add" type="primary" v-has="'afs_sys_param_modify'">添加</Button>
            </template>
            <template slot="action" slot-scope="{ row }">
                <div>
                    <Button @click="editParam(row)" size="small" type="primary" v-has="'afs_sys_param_modify'">编辑</Button>
                    <Button @click="delParam(row)" size="small" type="error" v-has="'afs_sys_param_del'">删除</Button>
                </div>
            </template>
        </rui-table>
        <Modal
            :closable="false"
            :mask-closable="false"
            :title="paramConfigTitle"
            :width="600"
            v-model="paramConfig">
                <rui-form
                          :form-options="paramConfigFormOptions"
                          :label-width="120"
                          :read-only="false"
                          ref="editForm">
                </rui-form>
            <div slot="footer">
                <Button @click="paramConfig = false" size="small">取消</Button>
                <Button @click="checkParamConfig" size="small" type="primary">保存</Button>
            </div>
        </Modal>
    </rui-page>
</template>

<script>
    import sysParamDefine from "./define/paramdefine";
    import {listParamInfo, modify,delParam,publishParams} from "_p/basic/api/admin/sysParam"
    import {deepClone} from "@/libs/utils/ObjectClone";
    export default {
        name: "sys-param-config",
        data() {
            return {
                queryRows: [
                    {
                        defineId: 'sysParamDefine',
                        totalSpan: 12,
                        fields: ['paramKey', 'paramDesc']
                    }
                ],
                paramConfigFormOptions: [
                    {
                        isGroup: false,
                        grids: [
                            {defineId: 'sysParamDefine', span: 24, fields: ['paramKey']},
                        ]
                    },
                    {
                        isGroup: false,
                        grids: [
                            {defineId: 'sysParamDefine', span: 24, fields: ['paramValue']},
                        ]
                    },
                    {
                        isGroup: false,
                        grids: [
                            {defineId: 'sysParamDefine', span: 24, fields: ['paramDesc']},
                        ]
                    },
                    {
                        isGroup: false,
                        grids: [
                            {defineId: 'sysParamDefine', span: 24, fields: ['changeAble']},
                        ]
                    }
                ],
                paramConfigTitle:'',
                paramConfig:false
            };
        },
        methods: {
            queryParamData(queryData) {
                listParamInfo(queryData).then(res => {
                    if (res.code === "0000") {
                        let {records, total} = res.data;
                        this.$refs.paramTable.updateTableData(records, total);
                    }
                });
            },
            createSysParam() {
                this.paramConfigTitle = '新建参数';
                this.$refs.editForm.setAllFieldRequired(true);
                let self = this;
                this.$nextTick(() => {
                    self.$refs.editForm.resetFrom();
                    this.paramConfig = true;
                })
            },
            delParam(row) {
                let self = this;
                this.$Modal.confirm({
                    title: "确认",
                    content: `确认删除该参数[${row.paramKey}]？`,
                    onOk: () => {
                        delParam(row.id).then(res => {
                            self.$refs['paramTable'].reloadData();
                        })
                    }
                });
            },
            editParam(row) {
                this.paramConfigTitle = '配置' + row.paramDesc + "(" + row.paramKey + ")";
                this.modelType = 'modify';
                this.$refs.editForm.updateFormData(deepClone(row));
                this.$refs.editForm.setAllFieldRequired(true);
                this.paramConfig = true;
            },
            syncParams(){
                let self = this;
                publishParams().then(res=>{
                    if (res.code === "0000") {
                        self.$Message.info('参数同步成功');
                    }
                })
            },
            checkParamConfig() {
                let self = this;
                this.$refs.editForm.getForm().validate((valid) => {
                    if (valid) {
                        let reqData = self.$refs.editForm.getFormData();
                            modify(reqData).then(res => {
                                if (res.code === '0000') {
                                    self.$refs['paramTable'].reloadData();
                                    self.paramConfig = false;
                                } else {
                                    self.$Message.error(res.msg);
                                }
                            }).catch(err => {

                            })
                    } else {
                        self.paramConfig = true;
                        self.$Message.error('数据不完整!');
                    }
                })
            }
        },
        computed: {
            defines() {
                return [
                    {
                        id: 'sysParamDefine',
                        fields: sysParamDefine
                    }
                ]
            }
        },
        mounted() {
            this.$refs['paramTable'].reloadData();
        }
    };
</script>
